<script setup>
import {defineProps,onMounted} from "vue"
import { router } from "../router"

const props = defineProps({
    back1:{type:String},
    back2:{type:String},
    scly1:{type:String},
    scly2:{type:String},
    linkPage1:{type:String},
    linkPage2:{type:String},
})

const showMyPage = (num) => {
    if(num == 1){
        //注意,无非是传值进来,router/index文件下没有的路径需自己添加
        router.replace(`/learn/ismy/${props.linkPage1}`)
    }else if(num == 2){
        //注意,无非是传值进来,router/index文件下没有的路径需自己添加
        router.replace(`/learn/ismy/${props.linkPage2}`)
    }else{}
}

</script>

<template>
    <div class="twosjlyDialog">
        <div class="fristBox" :style="{background:props.back1}" @click="showMyPage(1)">{{ props.scly1 }}</div>
        <div class="scoundBox" :style="{background:props.back2}" @click="showMyPage(2)">{{ props.scly2 }}</div>
    </div>
</template>

<style scoped>
.twosjlyDialog{
    width: 100%;
    height: 20%;
    display: flex;
    align-items: center;
}
.fristBox{
    margin: 2.5%;
    width: 45%;
    height: 80%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
}
.scoundBox{
    margin: 2.5%;
    width: 45%;
    height: 80%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
}
</style>